import {StyleSheet, Dimensions} from 'react-native';
let totalWidth = Dimensions.get('window').width;
let totalHeight = Dimensions.get('window').height;
let textSize = totalWidth / 18;
let readingUITitleHeight = textSize * 6;
let diaryBodyLine = totalHeight / textSize - 6;
let returnButtonHeight = textSize * 5;
let MCV = StyleSheet.create({
  container: {
    top: 0,
    flex: 1,
    marginTop: 2,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'white',
    borderWidth: 1,
  },
  firstRow: {
    //firstRow用来定义屏幕最上方显示按钮的View
    height: textSize * 1.4 + 2,
    flexDirection: 'row',
    width: totalWidth - 4, // margin设置为2，两边加起来就是4，所以宽度要减4
    justifyContent: 'space-around', //使用这个键值，可以看到这一行里的三个按钮不论
    margin: 2, //屏幕宽度是多少都会乖乖地排列好，感觉还是很省心的
  },
  longButton: {
    //定义一个比较长的Text做按钮
    height: textSize * 1.4,
    backgroundColor: 'gray',
    width: textSize * 10,
    borderRadius: 8, //设置了圆角风络，在iPhone平台上显示正常，但在Android
    textAlign: 'center', //手机上没有圆角风格，所以下面的Android手机运行截图
    fontSize: textSize, //中的按钮都是直角的。在真正商用开发时，还是尽量让美工
  }, //出图，用Image做按钮
  middleButton: {
    //长度适中的Text按钮样式
    height: textSize * 1.4,
    backgroundColor: 'gray',
    width: textSize * 5,
    borderRadius: 8,
    textAlign: 'center',
    fontSize: textSize,
  },
  diaryBodyStyle: {
    //显示、输入日记正文的TextInput组件样式
    flex: 1,
    width: totalWidth - 8, //读者可以试一试看不设置这个width的效果，并且注意在阅读
    fontSize: textSize, //日记和写日记界面中，日记显示（输入框）的左右两边能否与上面的边对齐
    backgroundColor: 'white',
    margin: 4,
  },
  smallButton: {
    //长度比较短的Text组件样式
    height: textSize * 1.4,
    backgroundColor: 'gray',
    width: textSize * 3,
    borderRadius: 8,
    textAlign: 'center',
    fontSize: textSize,
  },
  moodStyle: {
    //显示记日记时心情的Image组件样式
    height: textSize * 3.2,
    width: textSize * 3.2,
    borderRadius: textSize * 1.6,
  },
  subViewInReader: {
    //这个View用来在心情图片旁边显示日记的标题和时间
    width: totalWidth - 5 - textSize * 3.2,
  },
  textInReader: {
    //这是显示在心情图片旁边的标题和时间的Text组件样式
    height: textSize * 1.4,
    fontSize: textSize,
    backgroundColor: 'grey',
    margin: 2,
  },
  secondRow: {
    //阅读日记界面用来展示心情图片、日记标题、日记时间的View
    flexDirection: 'row',
    alignItems: 'center',
    backgroundColor: 'grey',
    borderRadius: 4,
    margin: 1,
  },
  titleInputStyle: {
    //写日记界面用来输入日记标题的TextInput组件样式
    fontSize: textSize,
    backgroundColor: 'grey',
    height: textSize * 2.4,
    color: 'black',
    margin: 4,
    borderWidth: 2,
    width: totalWidth - 12,
    borderColor: 'black',
  },
  searchBarTextInput: {
    //搜索关键字输入框样式定义
    backgroundColor: 'white',
    borderColor: 'black',
    height: textSize * 1.4,
    width: textSize * 10,
    paddingTop: 0, //如果不设置，在Android平台TextInput组件内输入显示异常
    paddingBottom: 0, //如果不设置，在Android平台TextInput组件内输入显示异常
    fontSize: 14,
  },
  item: {
    padding: 10,
    fontSize: 18,
    height: 44,
  },
});
export {MCV as default};
